/**
* Created by xudesong on 2019/1/14.
*/

<template>
    <div class="home1">
        <span class="demonstration">这是儿子组件 Home1111</span>

    </div>
</template>

<script lang="ts">
    import Vue from 'vue'
    import {Inject, Provide, Prop, Model, Watch, Emit, Mixins } from 'vue-property-decorator'
    import Component from 'vue-class-component'
    @Component
    export default class Home1 extends Vue{
        @Prop() age!:number;
        @Model("change") checked!:number;
        messageData= 'Hello home 这是儿子组件!'
        changed(event:any){ /* 这里是偷懒写的any，在实际项目中需要避免 */
            console.log( "this.: change ",event.target.value);
            this.$emit("change",event.target.value)
        }
    }
</script>

<style scoped lang="scss">
    .home1{
        width: 100%;
        height: 300px;
        background-color: rebeccapurple;
        .demonstration{
            color: red;
        }
    }

</style>